<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta name="format-detection" content="telephone=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
    <meta name="apple-mobile-web-app-title" content="数据列表">
    <meta name="description" content="数据列表展示页面">
    <meta name="keywords" content="数据,列表,H5">
    <link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>📋</text></svg>">
    <title>数据列表</title>
    <link rel="stylesheet" href="css/style.css">
</head>
<body>
    <div class="container">
        <header class="header">
            <h1>数据列表</h1>
            <div class="debug-tools">
                <label class="switch">
                    <input type="checkbox" id="mockDataSwitch">
                    <span class="slider"></span>
                </label>
                <span class="switch-label">使用模拟数据</span>
            </div>
        </header>
        
        <main class="main-content">
            <!-- 下拉刷新提示 -->
            <div class="refresh-tip" id="refreshTip">下拉刷新...</div>
            
            <!-- 数据列表容器 -->
            <ul class="data-list" id="dataList">
                <!-- 数据项将通过JS动态添加 -->
                <li class="loading">加载中...</li>
            </ul>
            
            <!-- 加载更多提示 -->
            <div class="load-more" id="loadMore">上拉加载更多...</div>
        </main>
    </div>
    
    <script src="js/app.js"></script>
    <script>
        // 模拟数据开关事件
        document.getElementById('mockDataSwitch').addEventListener('change', function(e) {
            if (window.config) {
                window.config.useMockData = e.target.checked;
                // 重新加载数据
                if (window.refreshData) {
                    window.refreshData();
                }
            }
        });
        
        // 暴露必要的全局函数和配置
        window.config = config;
        window.refreshData = refreshData;
    </script>
</body>
</html>